<template>
	<view class="container">
		<!-- 全部商品 -->
		<view class="goods-wrap">
			<view class="goods-con">
				<view class="goods-item-con" v-for='(item,index) in goodsList' @tap='jumpGoodsDetail(item.g_id)' v-if="goodsList.length > 0">
					<goods-item :goodsType='1' :item='item' @handleGoods='handleGoods(item)'
						@getPoster='getPoster'></goods-item>
				</view>
				<view class="no_box" v-if="goodsList.length == 0">
					<image src="https://wanchuyun-img.oss-cn-beijing.aliyuncs.com/guomai/1758dab4ef69269666f8c705f58df3492a8fc193.png" mode=""></image>
				</view>
			</view>
			<view class="loding-con" style="margin-top: 20rpx;" v-if="goodsList.length > 0">
				<view class="loding-end line_center" v-if='loadEnd'>
					<view>-</view>
					<view class="end-t">已经到底啦</view>
					<view>-</view>
				</view>
				<view class="loding line_center" v-else>
					<uni-icons type='spinner-cycle' size="30" color='#707070'
						class="distributor-anim distributor-anim-rotate distributor-anim-loop"></uni-icons>
					正在加载中~~
				</view>
			</view>
		</view>

	</view>
</template>

<script>
	const app = getApp()
	import goodsItem from '@/components/goods-item/goods-item_youhui.vue';
	export default {
		components:{
			goodsItem,
		},
		data() {
			return {
				scrollLeft:0,
				tabIndex:0,
				goodsList: [],
				loadEnd: true,
				page: 1,
				swiperList: [],
				totalPage: '',
				keyword: '',
				showGoodsModal: false,
				goodsDetail:{}
			}
		},
		onLoad(opt) {
			// this.getGoods()
		
		},
		onShow() {
			this.getGoods()
		},
		onReachBottom() {
			let that = this;
			if (that.page < that.totalPage) {
				this.loadEnd = false;
				that.page++;
				// that.getGoods()
			} else {
				this.loadEnd = true;
				return;
			}
		},
		onPullDownRefresh() {
			this.reload()
		},
		
		
		
		methods: {
			doSearch:function(){
				this.swiperList = [];
				this.goodsList = [];
				// this.page = 1;
				// this.totalPage = '';
				uni.showLoading({
					title: '加载中...',
					mask: true
				})
				this.getGoods()
			},
			/* 刷新方法 */
			reload() {
				this.swiperList = [];
				this.cateList = [];
				this.goodsList = [];
				// this.page = 1;
				// this.totalPage = '';
				uni.showLoading({
					title: '加载中...',
					mask: true
				})
				this.getGoods();
				uni.stopPullDownRefresh()
			},
			/* 获取商品列表 */
			getGoods() {
				let that = this;
				app.globalRequest({
					api: app.getApi().mall.shareGoodsList,
					data:{
						id_dividend: 1
					},
				}).then(res => {
					if (res.code == 0) {
						that.goodsList = res.data.data;
						// goodsList.forEach(v => {
						// 	v.priceObj = app.splicePrice(v.price);
						// 	v.num = 1;
						// })
						// that.goodsList = that.goodsList.concat(goodsList);
						// that.totalPage = res.data.last_page;
					}
				}).catch(err => {
			
				})
			},
			jumpGoodsDetail(g_id){
				uni.navigateTo({
					url:`/pages/goods-page/goods-detail/goods-detail?type=1&goods_id=${g_id}`
				})
			},
			/* 点击购物车 */
			handleGoods(item) {

				item.num = 1;
				this.goodsDetail = item;
				this.showGoodsModal = true;
			},
			close() {
				this.showGoodsModal = false
			}
		}
	}
</script>

<style lang="scss" scoped>
	.container{
		// margin:0 24rpx;
		padding-bottom: 100rpx;
		
	}

	.goods-wrap{
		background-color: #F5F5F5;
		.title{
			font-size: 36rpx;
		}
		.goods-con{
			display: flex;
			justify-content: space-between;
			flex-wrap: wrap;
			padding: 0 24rpx;
			box-sizing: border-box;
		}
		.goods-item-con{
			margin-top:24rpx;
		}
	}
	

	
	.no_box{
		width: 520rpx;
		height: 400rpx;
		margin: 250rpx auto;
		image{
			width: 100%;
			height: 100%;
		}
	}
</style>
